<template>
  <!-- Page, data-name contains page name which can be used in callbacks -->
  <div class="page" data-name="map">
    <!-- Top Navbar -->
    <div class="navbar">
      <div class="navbar-inner" style="background-color: #3ec889">
        <div class="left">
          <a href="#" class="link back" @click="sureFUN">
            <i class="icon icon-back"></i>
            <span class="ios-only">返回</span>
          </a>
        </div>
        <div class="center">位置</div>
        <div class="right">

          <a href="/baiduSearch/" class="link icon-only">
            <img src="../../img/search.png" style="width: 30px;height: 30px"/>
          </a>
          <a href="#" class="link icon-only" @click="sureFUN">
            <i class="icon another-icon">确定</i>
          </a>
        </div>
      </div>
    </div>
    <div class="page-content infinite-scroll-content" id="text-map" >
      <div id="kkmap" >
        <div id="l-map"></div>
      </div>
      <div class="list" id="map-list" style="margin-top: 0px">
        <ul> </ul>
      </div>
      <div class="preloader infinite-scroll-preloader" id="map-scroll-preloader"></div>
      <div class="infinite-scroll-nomore" id="map-scroll-nomore"></div>
    </div>
  </div>
</template>
<script>
  return {
    methods: {
      backFUN: function () {
        var self = this;
        window.isSaveAdr = false;
        self.$router.back("/");
      },
      sureFUN: function () {
        var self = this;
        window.isSaveAdr = true;
//        self.$router.navigate("/");
        self.$router.back("/");
//        $$('#map-ImageUrl').attr('src', url);
      },
    },
    on: {
      pageMounted: function(e, page) {
//        this.$router.off("mapList.marker");
        $$('.infinite-scroll-preloader').hide();
      },
      pageInit: function(e, page) {
//          console.log("pageInit");
        var pageSize = 20;
        var allowInfinite = true;
        var self = this;
        var map = new BMap.Map("l-map");
        map.centerAndZoom("新疆",15); // 初始化地图,设置城市和地图级别。

        //获取当前位置并标记
        if(window.locationAdr.lng&&window.locationAdr.lat){
          window.isLocation = false
          makeMarker(window.locationAdr.lng,window.locationAdr.lat,true);
        }

        //分页加载结果
        $$('.infinite-scroll-content').on('infinite', function () {

          if (!allowInfinite) return;
          allowInfinite = false;

          setTimeout(function () {
            allowInfinite = true;

            searchPageable(undefined,undefined,undefined,undefined,undefined,pageSize=10,self.$router);

          }, 1000);
        });
        map.addEventListener("dragend", function() {
            var center = map.getCenter();
          $$('.infinite-scroll-preloader').show();
            makeMarker(center.lng,center.lat,true)
          }
        );
        map.addEventListener("click", function(e) {
          $$('.infinite-scroll-preloader').show();
            makeMarker(e.point.lng,e.point.lat,true)
          }
        );
        self.$router.on("mapList.marker", function (re,isRefesh) {
          if(re.status === 0) {
              console.log("mapList.marker", re,isRefesh)
            makeMarker(re.result[0].x, re.result[0].y, isRefesh)
          }
        });
        function makeMarker(x,y,isSearch){
          window.markerLongitude = x;
          window.markerLatitude = y;
          var url = MAP_IMAGE_URL+window.markerLongitude+','+window.markerLatitude+'&zoom='+15+'&markers='+window.markerLongitude+','+window.markerLatitude;
          window.mapUrl=url;
           map.clearOverlays();    //清除地图上所有覆盖物

          var point = new BMap.Point(x,y);
           map.centerAndZoom(point, 15);
           var marker = new BMap.Marker(point);  // 创建标注
           map.addOverlay(marker);               // 将标注添加到地图中

          if(isSearch){
            setTimeout(function(){
              map.panTo(point);
            }, 2000);
            $$('#map-list ul').html("");
            searchPageable(undefined,x,y,undefined,1,pageSize=10, self.$router);
          }

        }

      },
    }
  }
</script>
